<template>
  <view class="template-circle tn-safe-area-inset-bottom">
    <tn-nav-bar
      fixed
      :isBack="false"
      :bottomShadow="false"
      backgroundColor="#362e7a"
    >
      <view class="custom-nav tn-flex">
        <view class="custom-nav__back">
          <view class="logo-pic tn-shadow-blur">
            <view class="logo-image">
              <image
                :src="configInfo.site_logo"
                style="width: 80rpx; height: 80rpx"
              ></image>
              <!-- <text style="top: -10rpx;font-size: 18px;">{{configInfo.shoname}}</text> -->
            </view>
          </view>
        </view>
        <view
          class="custom-nav__search tn-flex tn-flex-col-center tn-flex-row-center"
          @click="
            navigateToFn({ url: '/homeMixinPages/search', checkLogin: true })
          "
        >
          <view
            style="width: 100%"
            class="custom-nav__search__box tn-flex tn-flex-col-center tn-flex-row-left tn-border-solid tn-border-white tn-color-white"
          >
            <view class="custom-nav__search__icon tn-icon-search"></view>
            <view class="tn-padding-left-xs">搜索</view>
          </view>
        </view>
      </view>
    </tn-nav-bar>
    <view class="meng" :style="{ paddingTop: vuex_custom_bar_height + 'px' }">
      <!-- #ifdef MP -->
      <add-tip />
      <!-- #endif -->
      <view
        class="tn-radius"
        style="
          padding: 0 10px;
          margin: 40rpx 0;
          border-radius: 20rpx;
          overflow: hidden;
        "
        v-if="swiperList.length > 0"
      >
        <tn-swiper
          :list="swiperList"
          mode="none"
          imageMode="aspectFill"
          @click="hpicto"
          :height="300"
          :radius="20"
        ></tn-swiper>
      </view>

      <view
        class="tn-flex"
        v-if="configInfo.xcx_sh == 1"
        style="padding: 0 20rpx"
      >
        <view
          @click="yuyin()"
          style="
            height: 284rpx;
            width: 312rpx;
            border-radius: 20rpx;
            margin-right: 20rpx;
            background: linear-gradient(180deg, #4185ff 0%, #55dffc 100%);
            padding: 20rpx 16rpx 24rpx 24rpx;
            display: flex;
            flex-direction: column;
          "
        >
          <view style="height: 100%">
            <p
              style="
                color: #fff;
                font-size: 28rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
              "
            >
              直播面对面
            </p>
            <p
              style="
                color: #fff;
                font-size: 20rpx;
                font-family: Source Han Sans CN;
              "
            >
              实时连麦打破次元壁
            </p>
          </view>
          <view
            style="
              display: flex;
              justify-content: space-between;
              align-items: flex-end;
            "
          >
            <p
              style="
                width: 120rpx;
                height: 40rpx;
                background: rgba(255, 255, 255, 0.5);
                border-radius: 60rpx;
                color: #fff;
                font-size: 20rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
                text-align: center;
                line-height: 40rpx;
              "
            >
              加入聊天
            </p>
            <image
              src="/static/img/index/homeTop0.png"
              style="width: 128rpx; height: 98rpx"
            ></image>
          </view>
        </view>

        <view class="tn-flex-2" style="width: 160rpx; height: 284rpx">
          <view
            @click="
              navigateToFn({ url: '/friendMixinPages/index', checkLogin: true })
            "
            class="tn-flex-1"
            style="
              height: 132rpx;
              margin: 0 10rpx 0 0;
              border-radius: 20rpx;
              background: linear-gradient(270deg, #a7f6f9 0%, #6a6dff 100%);
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
            "
          >
            <image
              src="/static/img/index/homeTop1.png"
              style="width: 72rpx; height: 72rpx"
            ></image>
            <p
              style="
                color: #fff;
                font-size: 28rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
              "
            >
              风向标
            </p>
          </view>
          <view
            @click="
              navigateToFn({
                url: '/homeMixinPages/yaoyue/index',
                checkLogin: true,
              })
            "
            class="tn-flex-1 bg-flex-shadow"
            style="
              height: 132rpx;
              margin: 20rpx 10rpx 0 0;
              border-radius: 20rpx;
              background: linear-gradient(
                90deg,
                #7f50fe 0%,
                #ffaef8 67%,
                #d5b7f8 100%
              );
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
            "
          >
            <image
              src="/static/img/index/homeTop2.png"
              style="width: 72rpx; height: 72rpx"
            ></image>
            <p
              style="
                color: #fff;
                font-size: 28rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
              "
            >
              一起玩
            </p>
          </view>
        </view>
        <view class="tn-flex-2 left2" style="width: 160rpx">
          <!-- @click="linghun()" -->
          <view
            @click="
              navigateToFn({ url: '/friendMixinPages/pipei', checkLogin: true })
            "
            class="tn-flex-1 bg-flex-shadow"
            style="
              height: 132rpx;
              margin: 0 0 0 10rpx;
              border-radius: 20rpx;
              background: linear-gradient(0deg, #895afe 0%, #fa87c2 100%);
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
            "
          >
            <image
              src="/static/img/index/homeTop3.png"
              style="width: 68rpx; height: 68rpx"
            ></image>
            <p
              style="
                color: #fff;
                font-size: 28rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
              "
            >
              灵魂匹配
            </p>
          </view>
          <!-- /friendMixinPages/loveping/index -->
          <!-- /homeMixinPages/yaoyue/index -->
          <view
            @click="
              navigateToFn({
                url: '/friendMixinPages/loveping/index',
                checkLogin: true,
              })
            "
            class="tn-flex-1 bg-flex-shadow"
            style="
              height: 132rpx;
              margin: 20rpx 0 0 10rpx;
              border-radius: 20rpx;
              background: linear-gradient(270deg, #66e0ff 0%, #6ef0da 100%);
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
            "
          >
            <image
              src="/static/img/index/homeTop4.png"
              style="width: 68rpx; height: 68rpx"
            ></image>
            <p
              style="
                color: #fff;
                font-size: 28rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
              "
            >
              秘密树洞
            </p>
          </view>
        </view>
      </view>
    </view>

    <view
      class="hot-list"
      @click="
        navigateToFn({ url: '/homeMixinPages/paihang', checkLogin: false })
      "
    >
      <view
        style="margin-left: 80rpx; height: 100%"
        class="tn-flex tn-flex-direction-column tn-flex-row-center"
      >
        <p>社交星曜人气榜单</p>
        <p>你的每次互动都在为TA加冕星光</p>
      </view>
      <image
        class="trophy"
        src="/static/other/trophy.png"
        style="width: 160rpx; height: 180rpx"
      ></image>
    </view>

    <view style="width: 100%; position: relative; padding: 0 20rpx">
      <p
        style="
          color: #24d4d1;
          font-family: Source Han Sans CN;
          font-size: 36rpx;
          font-weight: 900;
          margin-bottom: 20rpx;
        "
      >
        推荐
      </p>
    </view>

    <mescroll-body ref="mescrollRef" @down="downCallback" @up="upCallback">
      <!-- <quan-news :list="content" :index="true"></quan-news> -->
      <recommended-list :list="content" :index="true" />
    </mescroll-body>

    <tn-modal
      width="80%"
      v-model="pipeishow"
      backgroundColor="#E4E9EC"
      padding="30rpx 80rpx"
      :radius="25"
      title="正在匹配中"
      :showCloseBtn="false"
      :maskCloseable="false"
      :zoom="true"
      :custom="true"
    >
      <view class="custom-modal-content tn-padding-sm">
        <view class="tn-text-center tn-color-black" style="font-size: 14px">
          系统正在为你匹配
        </view>
        <view class="tn-text-center tn-padding-sm">
          <tn-loading show="show" :size="80" color="#aa00ff"></tn-loading>
        </view>
        <view class="tn-text-center tn-padding-top" @click="pipeishow = false">
          <tn-button
            :fontSize="28"
            padding="20rpx"
            height="56rpx"
            backgroundColor="tn-cool-bg-color-3"
            fontColor="tn-color-white"
            >取消匹配</tn-button
          >
        </view>
      </view>
    </tn-modal>

    <tn-modal
      width="80%"
      v-model="qiyushow"
      backgroundColor="tn-main-gradient-purplered--reverse"
      padding="30rpx 20rpx"
      :radius="25"
      title="设置"
      :showCloseBtn="true"
      :maskCloseable="false"
      :zoom="true"
      :custom="true"
    >
      <view class="custom-modal-content tn-padding-sm">
        <view class="tn-flex tn-flex-row-center">
          <view
            class="justify-content-item tn-padding-sm tn-text-center tn-margin-xs tn-radius bg-flex-shadow tn-shadow-blur"
          >
            <view class="justify-content-item tn-padding">
              <tn-avatar size="xl" :src="userbody.avatar"></tn-avatar>
              <view
                class="tn-text-center tn-color-white tn-text-bold tn-text-xl"
                >{{ userbody.nickname }}
              </view>
              <view class="tn-text-center tn-color-white">{{
                userbody.zhiye
              }}</view>
              <view class="tn-text-center tn-color-white"
                >{{ userbody.dec }}
              </view>
            </view>

            <tn-button
              @click="
                navigateToFn({
                  url: '/circleMixinPages/blogger_other?id=' + userbody.id,
                  checkLogin: true,
                })
              "
              shape="round"
              backgroundColor="tn-main-gradient-aquablue--light"
              padding="40rpx 0"
              width="100%"
              shadow
              fontBold
            >
              <text class="tn-color-black">进主页</text>
            </tn-button>
          </view>
        </view>
      </view>
    </tn-modal>

    <!-- 登录框组件 -->
    <login-fn
      :is-show-login="loginBoxFlag"
      @loginSuccessCallback="refreshFn"
      @close="closeGlobalLoginFn"
    >
    </login-fn>
    <!-- 压屏窗-->
    <tn-landscape
      :show="tanchuangshow"
      :maskCloseable="false"
      closePosition="rightTop"
      @close="closeLandscape"
    >
      <image
        :src="tanchuanglistimage"
        mode="widthFix"
        @click="tanchuang()"
      ></image>
    </tn-landscape>
    <view style="height: 50px"></view>
  </view>
</template>

<script>
import { host } from "@/siteinfo.js";
import silenceUpdate from "@/uni_modules/rt-uni-update/js_sdk/silence-update.js"; //引入静默更新
import template_page_mixin from "@/libs/mixin/template_page_mixin.js";
import MescrollBody from "@/components/mescroll-uni/mescroll-body.vue";
import MescrollUni from "@/components/mescroll-uni/mescroll-uni.vue";
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import RecommendedList from "../components/recommended-list/index.vue";

export default {
  name: "",
  mixins: [template_page_mixin, MescrollMixin],
  components: {
    MescrollBody,
    RecommendedList,
  },
  data() {
    return {
      shezhi: false,
      qiyushow: false,
      userbody: [],
      pipeishow: false,
      sex: 0,
      shoplist: [],
      vodurl: "",
      videoPlay: false,
      tanchuanglistimage: "",
      activeItemStyle: {
        fontSize: `38rpx`,
      },
      barStyle: {
        boxShadow: `12rpx 12rpx 16rpx #01BEFF`,
      },
      show_fabu: false,
      loading: true,
      skeleton1: {
        avatarSize: "52px",
        row: 3,
        showTitle: true,
      },
      loginBoxFlag: false, // 登录框显示隐藏状态
      cardCur: 0,
      swiperList: [],
      current: 0,
      currenttiezi: 0,
      scrollList: [
        {
          name: "人气",
        },
        {
          name: "附近",
        },
        {
          name: "同城",
        },
      ],
      latestUserAvatar: [],
      bloggerList: [],
      // 内容默认隐藏显示的高度
      contentHideShowHeight: 0,
      content: [],
      adList: [],
      roomlist: [],
      adAutoplay: false,
      mygrouplist: [],
      bloggerhotList: [],
      tanchuangshow: false,
      msgcount: 0,
      iconnew: [],
      resumeList: [],
      cardCur2: 0,
    };
  },
  onShow() {},

  onLoad(option) {
    uni.setNavigationBarTitle({
      title: this.configInfo.shoname,
    });

    if (!uni.getStorageSync("user_id")) {
      if (
        window.location.href.indexOf("?code=") !== -1 ||
        window.location.href.indexOf("&code=") !== -1
      ) {
        let code;
        if (window.location.href.indexOf("?code=") !== -1) {
          code = window.location.href.split("?code=")[1].split("&")[0];
          setTimeout(function () {
            uni.navigateTo({
              url: "/pages/tabbar/login/login?code=" + code,
            });
          }, 1000);
        }
      }
    }

    if (option.daren_id) {
      uni.setStorageSync("daren_id", option.daren_id);
    }
    //手动刷新	uni.startPullDownRefresh();

    uni.onTabBarMidButtonTap(() => {
      uni.navigateTo({
        url: "/circleMixinPages/edit?tab=1",
      });
    });
  },
  onPullDownRefresh() {
    this.info();
    setTimeout(function () {
      uni.stopPullDownRefresh();
    }, 1000);
  },

  mounted() {
    let that = this;
    that.info("rec");
    that.initContentData();
    that.contentHideShowHeight = uni.upx2px(56) * 3;
    that.adAutoplay = true;

    uni.$off("setLoginBoxFlag_home");
    uni.$on("setLoginBoxFlag_home", (loginBoxFlag) => {
      that.loginBoxFlag = loginBoxFlag;
    });
    uni.$on("jianshacount", (shu) => {
      if (shu == 10000) {
        //this.paymp3('/static/shou.mp3', 0)
        this.msgcount++;
        this.msggai(this.msgcount);
      } else if (this.msgcount > 0 || shu > 0) {
        this.msgcount = this.msgcount - shu;
        this.msggai(this.msgcount);
      }
    });
    // 注册接受消息监听
    uni.$on("index", (message) => {
      uni.$emit("jianshacount", 10000);
    });

    //#ifdef APP-PLUS
    this.$nextTick(() => {
      that.gengxin();
    });
    //#endif
  },

  methods: {
    async linghunpass() {
      let that = this;
      let result = await that.$request({
        loading: 0,
        method: "post",
        url: "/chat/four/userMatch",
        data: {},
      });

      if (result.statusCode == 200) {
        if (result.data.code == 200) {
          this.qiyushow = true;
          this.userbody = result.data.data;
        } else if (result.data.msg == "当前无人在线") {
          this.msg(result.data.msg);
        } else {
          let that = this;
          uni.showModal({
            title: "提示",
            content: result.data.msg,
            confirmText: "去完善",
            success: function (res) {
              if (res.confirm) {
                uni.navigateTo({
                  url: "/mineMixinPages/set",
                });
              } else if (res.cancel) {
                console.log("用户点击取消");
              }
            },
          });
        }
      } else {
        uni.showToast({
          icon: "none",
          title: that.$errorMsg,
        });
      }
    },

    async linghun() {
      if (!uni.getStorageSync("token")) {
        this.loginBoxFlag = true;
        return;
      }

      this.pipeishow = true;
      setTimeout(() => {
        this.pipeishow = false;
        this.linghunpass();
      }, 3000);
    },
    // 暂时屏蔽
    yuyin() {
      // return false
      if (!uni.getStorageSync("token")) {
        this.loginBoxFlag = true;
        return;
      }
      this.navigateToFn({
        url: "/mineMixinPages/chat/voc_index", //'/friendMixinPages/pipei', //friendMixinPages/pipei
        checkLogin: true,
      });
    },

    resume(e) {
      this.cardCur2 = e.detail.current;
    },

    onTabItemTap(e) {
      console.log("在首页点击按钮");
      console.log(e);
      if (e.index == 2) {
        uni.navigateTo({
          url: "/circleMixinPages/edit?tab=1",
        });
      }
    },

    screenChange(e) {
      let _this = this;
      let fullScreen = e.detail.fullScreen;
      if (!fullScreen) {
        _this.videoContext.pause();
        _this.videoPlay = false;
      }
    },
    videoShow(vod) {
      let _this = this;
      _this.vodurl = vod;
      _this.videoPlay = true;
      _this.videoContext = uni.createVideoContext("myvideo", _this);
      _this.videoContext.requestFullScreen();
      _this.videoContext.play();
    },

    async info() {
      let that = this;
      let result = await that.$request({
        loading: 1,
        method: "post",
        url: "/chat/index/index",
        data: {
          type: 1,
        },
      });
      if (result.statusCode == 200) {
        if (result.data.code == 200) {
          that.tanchuanglist = result.data.data.tanchuanglist[0];
          if (result.data.data.tanchuanglist.length > 0) {
            that.tanchuangshow = true;
            that.tanchuanglistimage = that.tanchuanglist.image;
          }
          that.swiperList = result.data.data.swiperList;
          that.roomlist = result.data.data.roomlist;

          that.loading = false;
          this.msgcoutget();
          if (result.data.data.is_openweb == 0) {
            uni.showModal({
              title: "提示",
              content: result.data.data.is_openwebtishi,
              showCancel: false,
              success: (res) => {
                if (res.confirm) {
                  // #ifdef APP-PLUS
                  uni.getSystemInfo({
                    success: function (res) {
                      // 判断为安卓的手机
                      if (res.platform == "android") {
                        // 安卓退出app
                        plus.runtime.quit();
                      } else {
                        // 判断为ios的手机，退出App
                        plus.ios
                          .import("UIApplication")
                          .sharedApplication()
                          .performSelector("exit");
                      }
                    },
                  });
                  // #endif
                  // #ifdef MP||H5
                  uni.reLaunch({
                    url: "/pages/index/index",
                  });
                  // #endif
                }
              },
            });
          }
        } else {
          uni.showToast({
            icon: "none",
            title: result.data.msg,
          });
        }
      } else {
        uni.showToast({
          icon: "none",
          title: that.$errorMsg,
        });
      }
    },
    async msgcoutget() {
      let that = this;
      let result = await that.$request({
        loading: 0,
        method: "post",
        url: "/chat/index/getmsgcount",
        data: {},
      });
      if (result.statusCode == 200) {
        if (result.data.code == 200) {
          this.msgcount = result.data.msg;
          this.msggai(this.msgcount);
        }
      }
    },

    /// 列表调用

    downCallback(mescroll) {
      mescroll.endSuccess();
      mescroll.resetUpScroll();
    },

    async upCallback(mescroll) {
      let that = this;

      if (!uni.getStorageSync("latlng") && this.current == 1) {
        this.msg("请没有开启定位无法查看");
        return;
      }

      let result = await that.$request({
        loading: 1,
        method: "post",
        url: "/chat/index/followList_fujin",
        data: {
          type: this.current,
          sex: this.sex,
          latitude: uni.getStorageSync("latlng").latitude,
          longitude: uni.getStorageSync("latlng").longitude,
          page: mescroll.num,
        },
      });
      if (result.statusCode == 200) {
        if (result.data.code == 200) {
          if (mescroll.num == 1) {
            that.content = result.data.data.data;
          } else {
            that.content = that.content.concat(result.data.data.data);
          }
          mescroll.endSuccess(
            result.data.data.data.length,
            result.data.data.data.length >= mescroll.size
          );
        } else {
          uni.showToast({
            icon: "none",
            title: result.data.msg,
          });
        }
      } else {
        uni.showToast({
          icon: "none",
          title: that.$errorMsg,
        });
      }
    },

    // 跳转
    tn(e) {
      uni.navigateTo({
        url: e,
      });
    },

    // 震动跳转
    navCreate(e) {
      wx.vibrateLong();
      uni.navigateTo({
        url: "/circleMixinPages/create",
      });
    },
    liaotianroom() {
      uni.navigateTo({
        url: "/circleMixinPages/roomlist",
      });
    },
    // 震动跳转
    navBuild(e) {
      wx.vibrateLong();
      uni.navigateTo({
        url: "/circleMixinPages/build",
      });
    },
    // 处理内容，给内容添加对应的标识信息
    initContentData() {
      this.content.forEach((item, index) => {
        // 是否需要隐藏内容
        item.hideContent = false;
        // 显示所有内容
        item.showAllContent = false;
        // 内容容器的实际高度
        item.contentContainerHeight = 0;
        // 内容容器是否初始化完成
        item.contentContainerInit = false;
        this.$set(this.content, index, item);
      });
    },
    // 获取内容容器的信息
    getContentRectInfo() {
      let contentRect = {};
      const query = uni.createSelectorQuery().in(this);
      // 筛选出存在内容的数据
      this.content.forEach((item, index) => {
        if (item?.content) {
          query.select(`#blogger__content--${index}`).boundingClientRect();
          contentRect[index] = item;
        }
      });
      // 获取所有内容的宽高信息
      query.exec((res) => {
        if (!res) {
          setTimeout(() => {
            this.getContentRectInfo();
          }, 10);
          return;
        }
        // console.log(res);
        res.map((item) => {
          // console.log(item.height, this.contentHideShowHeight);
          // 获取对应的标号
          const id = item.id;
          const idIndex = /blogger__content--(\d)/.exec(id)[1];
          let contentItem = this.content[idIndex];
          contentItem.hideContent = item.height > this.contentHideShowHeight;
          contentItem.showAllContent = false;
          contentItem.contentContainerHeight = item.height;
          contentItem.contentContainerInit = true;
          this.$set(this.content, idIndex, contentItem);

          // console.log(/blogger__content--(\d)/.exec(id)[1]);
        });
      });
    },
    // 切换内容的显示与隐藏
    switchContentShowStatus(index) {
      const contentItem = this.content[index];
      contentItem.showAllContent = !contentItem.showAllContent;
      this.$set(this.content, index, contentItem);
    },
    // 关闭压屏窗
    closeLandscape() {
      this.tanchuangshow = false;
      this.show_fabu = false;
    },
    hpicto(index) {
      if (this.swiperList[index].url && this.swiperList[index].leixing == 0) {
        this.tn(
          "/circleMixinPages/details?id=" + this.swiperList[index].url + ""
        );
      }
      if (this.swiperList[index].url && this.swiperList[index].leixing == 1) {
        this.tn(
          "/circleMixinPages/blogger_other?id=" +
            this.swiperList[index].url +
            ""
        );
      }
      if (this.swiperList[index].url && this.swiperList[index].leixing == 2) {
        this.navigateToFn({
          url:
            "/mineMixinPages/chat/room_text?id=" + this.swiperList[index].url,
          checkLogin: true,
        });
      }
    },
    tanchuang() {
      if (this.tanchuanglist.url && this.tanchuanglist.leixing == 0) {
        this.tn("/circleMixinPages/details?id=" + this.tanchuanglist.url + "");
      }
      if (this.tanchuanglist.url && this.tanchuanglist.leixing == 1) {
        this.tn("/circleMixinPages/group?id=" + this.tanchuanglist.url + "");
      }
      if (this.tanchuanglist.url && this.tanchuanglist.leixing == 2) {
        this.navigateToFn({
          url: "/mineMixinPages/chat/room_text?id=" + this.tanchuanglist.url,
          checkLogin: true,
        });
      }
      if (this.tanchuanglist.url && this.tanchuanglist.leixing == 4) {
        this.tn("/shopPages/product?id=" + this.tanchuanglist.url + "");
      }
      if (this.tanchuanglist.url && this.tanchuanglist.leixing == 5) {
        this.tn(
          "/circleMixinPages/team/show?id=" + this.tanchuanglist.url + ""
        );
      }
    },
    refreshFn() {},
    jinruroom(id) {
      // #ifdef APP-PLUS
      this.navigateToFn({
        url: "/mineMixinPages/chat/room_text?id=" + id,
        checkLogin: true,
      });
      // #endif
      // #ifndef APP-PLUS

      this.navigateToFn({
        url: "/mineMixinPages/chat/room_text?id=" + id,
        checkLogin: true,
      });
      // #endif
    },

    geturl(item) {
      if (item.appId) {
        // #ifdef MP
        uni.navigateToMiniProgram({
          appId: item.appId,
          path: item.page_url,
          success(res) {
            // 打开成功
          },
        });
        // #endif
        // #ifndef MP
        this.msg("小程序内使用");
        // #endif
      } else {
        this.navigateToFn({
          url: item.page_url,
          checkLogin: true,
        });
      }
    },

    tabsChange(index) {
      let that = this;

      if (index == 1) {
        this.current = index;
        // #ifdef APP-PLUS||H5
        uni.getLocation({
          type: "gcj02",
          geocode: true,
          success: function (res) {
            uni.setStorageSync("latlng", res);
            console.log(res);
            that.mescroll.resetUpScroll();
          },
          fail: function (res) {
            console.log(res);
          },
        });
        // #endif

        // #ifdef MP
        wx.getFuzzyLocation({
          type: "wgs84",
          success(res) {
            uni.setStorageSync("latlng", res);
            that.mescroll.resetUpScroll();
          },
        });
        // #endif
      }
      if (index == 0) {
        this.current = index;
        this.mescroll.resetUpScroll();
      }

      if (index == 2) {
        this.navigateToFn({
          url: "/friendMixinPages/map",
          checkLogin: true,
        });
      }
    },

    msggai(shuzi) {
      if (shuzi <= 0) {
        uni.removeTabBarBadge({
          index: 2,
        }); //移除条数
      } else {
        uni.setTabBarBadge({
          index: 2,
          text: `${shuzi}`,
        });
      }
    },
    gengxin() {
      // 获取本地应用资源版本号
      plus.runtime.getProperty(plus.runtime.appid, (inf) => {
        uni.request({
          url: host + "/chat/index/app_up", //示例接口
          data: {
            edition_type: plus.runtime.appid,
            version_type: uni.getSystemInfoSync().platform,
            edition_number: inf.versionCode,
          },
          success: (res) => {
            //	console.log(res.data.data)
            //	console.log(inf.versionCode)

            if (
              Number(res.data.data.edition_number) > Number(inf.versionCode) &&
              res.data.data.edition_issue == 1
            ) {
              if (
                res.data.data.package_type == 1 &&
                res.data.data.edition_silence == 1
              ) {
                silenceUpdate(res.data.data.edition_url);
              } else {
                //跳转更新页面 （注意！！！如果pages.json第一页的代码里有一打开就跳转其他页面的操作，下面这行代码最好写在setTimeout里面设置延时3到5秒再执行）
                uni.navigateTo({
                  url:
                    "/uni_modules/rt-uni-update/components/rt-uni-update/rt-uni-update?obj=" +
                    JSON.stringify(res.data.data),
                });
              }
            } else {
            }
          },
        });
      });
    },
    tiaozhuan() {
      uni.navigateToMiniProgram({
        appId: "wxd2ade0f25a874ee2", // 此为生活缴费appid
        path: "main/pages/nativeindex/nativeindex", // 此为生活缴费首页路径
        envVersion: "release",
        success: (res) => {
          console.log("打开成功", res);
        },
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.template-circle {
  max-height: 100vh;
}

.tn-tabbar-height {
  min-height: 120rpx;
  height: calc(140rpx + env(safe-area-inset-bottom) / 2);
}

/* 自定义导航栏内容 start */
.custom-nav {
  height: 100%;
  //	background-image: repeating-linear-gradient(-45deg, #fbf7ac69, #fff20014);
  color: #080808;

  &__back {
    margin: auto 0;
    font-size: 40rpx;
    margin-left: 20rpx;
    flex-basis: 5%;
  }

  &__search {
    flex-basis: 100%;
    width: 100%;
    height: 100%;

    &__box {
      width: 100%;
      height: 70%;
      padding: 10rpx 0;
      margin: 0 20rpx;
      border-radius: 60rpx;
      font-size: 24rpx;
    }

    &__icon {
      padding-right: 10rpx;
      margin-left: 20rpx;
      font-size: 30rpx;
    }

    &__text {
      color: #aaaaaa;
    }
  }
}

.hot-list {
  width: 100%;
  height: 136rpx;
  background-image: url("../static/other/ListBg.png");
  background-size: 100% 100%;
  color: #fff;
  position: relative;
  margin: 36rpx 20rpx 24rpx 20rpx;

  .trophy {
    position: absolute;
    right: 68rpx;
    bottom: 0;
  }

  p:nth-child(1) {
    font-size: 36rpx;
    font-weight: bolder;
    margin-bottom: 12rpx;
    font-style: italic;
  }

  p:nth-child(2) {
    font-size: 20rpx;
    font-family: Source Han Sans CN;
  }
}

.bg-flex-shadow {
  background-color: #00c3ff;
  z-index: 9999;
}

/* 间隔线 start*/
.tn-strip-bottom {
  border-bottom: 10rpx solid rgba(241, 241, 241, 0.8);
}
</style>
<style lang="scss">
::v-deep .tn-swiper {
  border-radius: 20rpx;
  overflow: hidden;

  .tn-swiper__item__image {
    border-radius: 20rpx;
  }
}
</style>
